<template>
  <!-- 作业查询模块-任务查询-异常任务查询页面 -->
  <div class="fillcontain">
    <!-- 查询条件 -->
    <div class="fastQuery">
      <el-row>
        <el-col :span="2" class="fastQuery_title"><i class="el-icon-tickets"></i><span> 查询条件</span></el-col>
        <el-col :span="10"></el-col>
        <el-col :span="4" class="moreCondition">
          <span v-if="!isShow" @click="showorhide">更多条件 <i class="el-icon-d-arrow-right"></i></span>
          <span v-if="isShow" @click="showorhide">收起 <i class="el-icon-d-arrow-left"></i></span>
        </el-col>
        <el-col :span="8"></el-col>
      </el-row>
    </div>
    <el-form v-show="isShow" :model="searchParams" label-width="100px" class="search_container">
      <el-row>
        <el-col :span="6" class="common-box">
          <el-form-item label="受理号" prop="caseno">
            <el-input v-model="searchParams.caseno" placeholder="受理号" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6" class="common-box">
          <el-form-item label="保单号" prop="chdrnum">
            <el-input v-model="searchParams.chdrnum" oninput="if(value.length>8) value=value.slice(0,8)"
                      placeholder="保单号" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6" class="common-box">
          <el-form-item label="变更类型" prop="changetype">
            <el-select v-model="searchParams.changetype" placeholder="变更类型" clearable filterable>
              <el-option
                  v-for="item in docTypeMap"
                  :key="item.sdoctypeid"
                  :label="item.sdoctypnam"
                  :value="item.sdoctypnam">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6" class="common-box">
          <el-form-item label="存仓号" prop="depotno">
            <el-input v-model="searchParams.depotno" placeholder="存仓号" clearable></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6" class="common-box">
          <el-form-item label="扫描时间(起始)：" prop="begintime">
            <el-date-picker v-model="searchParams.begintime" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
                            placeholder="选择日期" @change="clearTimeSetDefault">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6" class="common-box">
          <el-form-item label="扫描时间(结束)：" prop="lasttime">
            <el-date-picker v-model="searchParams.lasttime" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
                            placeholder="选择日期" @change="clearTimeSetDefault">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6" class="common-box">
          <el-form-item label="处理时间：" prop="dealtime">
            <el-date-picker v-model="searchParams.dealtime" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
                            placeholder="选择日期" @change="clearTimeSetDefault">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6" class="common-box">
          <el-form-item label="是否处理" prop="routeid">
            <el-select v-model="searchParams.routeid" placeholder="是否处理" clearable>
              <el-option v-for="item in errors" :key="item.value" :label="item.name" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6" class="text_right" style="float: right;">
          <el-button type="primary" icon="el-icon-search" @click="search"></el-button>
          <el-button type="primary" plain icon="el-icon-refresh" @click="resetSearch"></el-button>
        </el-col>
      </el-row>

    </el-form>
    <div class="contain">
      <!-- 查询结果 -->
      <div class="table_container">
        <el-table
            v-loading="loading"
            :data="tableData"
            highlight-current-row
            header-cell-class-name="table-header-class"
            style="width:100%">
          <el-table-column
              type="selection"
              width="55">
          </el-table-column>
          <el-table-column
              min-width="120"
              property="caseno"
              label="受理号"
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="120"
              property="postype"
              label="变更类型"
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="120"
              property="chdrnum"
              label="保单号码"
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="120"
              property="appFrom"
              :formatter="appFromFormat"
              label="受理来源"
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="120"
              property="busitype"
              :formatter="busitypeFormat"
              label="保单服务类型"
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="120"
              property="depotno"
              label="存仓号"
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="120"
              property="checkUser"
              label="审核人员"
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="160"
              property="scantime"
              label="扫描时间"
              align='center'
              sortable
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="160"
              property="dealtime"
              label="处理时间"
              sortable
              align='center'
              show-overflow-tooltip>
          </el-table-column>
          <el-table-column
              min-width="80"
              fixed="right"
              label="操作"
              align='center'>
            <template slot-scope="scope">
              <span class="operationIcon" v-if="scope.row.routeid == 'error_dcl'"
                    @click="changeTask(scope.row.taskno,scope.row.routeid)">
                  <el-tooltip class="item" effect="light" content="处理" placement="top">
                      <i class="el-icon-edit"></i>
                  </el-tooltip>
              </span>
              <span v-if="scope.row.routeid != 'error_dcl'">已处理</span>
            </template>
          </el-table-column>
        </el-table>
        <el-row>
          <el-col :span="24">
            <div class="pagination">
              <el-pagination
                  background
                  v-if='paginations.total > 0'
                  :page-sizes="paginations.pageSizes"
                  :page-size="paginations.pageSize"
                  :layout="paginations.layout"
                  :total="paginations.total"
                  :current-page='paginations.pageIndex'
                  @current-change='handleCurrentChange'
                  @size-change='handleSizeChange'>
              </el-pagination>
            </div>
          </el-col>
        </el-row>
      </div>
    </div>

  </div>
</template>

<script>
  import constant from '@/utils/constant';
  import TaskConstants, {call} from "@/api/taskManager/common";
  import {isCntainChinese, isNotNumber} from "@/api/refund/RefundCommon";
  import {getDocTypeMap} from "@/api/taskCenter/taskCommon";

  export default {
    data() {
      return {
        isShow: false,
        // 查询条件
        searchParams: {
          caseno: '',
          chdrnum: '',
          changetype: '',
          depotno: '',
          begintime: '',
          lasttime: '',
          dealtime: '',
          routeid: '',
          pageNumber: '',
          pageSize: '',
        },
        loading: false,
        emptySearchParams: {},
        tableData: [],
        //需要给分页组件传的信息
        paginations: {
          total: 0,        // 总数
          pageIndex: 1,  // 当前位于哪页
          pageSize: 10,   // 1页显示多少条
          pageSizes: [5, 10, 15, 20],  //每页显示多少条
          layout: "total, sizes, prev, pager, next, jumper"   // 翻页属性
        },
        errors: [
          {name: "请选择", value: ""},
          //异常任务 待处理
          {name: "待处理", value: "error_dcl"},
          //异常任务已处理;
          {name: "已处理", value: "error_end"},
        ],
        docTypeMap: {},//文件类型对象
      }
    },
    created() {
      this.emptySearchParams = JSON.parse(JSON.stringify(this.searchParams));
      // this.getList();
    },
    mounted() {
      getDocTypeMap().then(data => this.docTypeMap = data);
      // this.getList();
    },
	activated(){
	    document.onkeydown = (event)=>{
	        var e = event || window.event || arguments.callee.caller.arguments[0];
	        if (e && e.keyCode == 113) {
	            this.search();
	        }
	    };
	}, 
    methods: {
      // 受理来源--转换中文
      appFromFormat(row) {
        const resString = row.appFrom;
        if (resString == '1') {
          return "纸质";
        } else if (resString == '2') {
          return "电子";
        } else {
          return resString;
        }
      },
      // 保单服务类型--转换中文
      busitypeFormat(row) {
        const resString = row.busitype;
        if (resString == 'ERROR') {
          return "异常任务";
        } else {
          return resString;
        }
      },
      clearTimeSetDefault(val) {
        if (val == null) {
          val = '';
        }
      },
      showorhide() {
        this.isShow = !this.isShow;
      },
      show() {
        this.$store.dispatch('loading/CHANGE_LOADING', true);
      },
      cancle() {
        this.$store.dispatch('loading/CHANGE_LOADING', false)
      },
      /* 任务处理 */
      changeTask(taskno, routeid) {
        if (routeid == 'error_end') {
          this.$message.error("该异常任务已被处理，无法继续处理！");
          return;
        }
        this.show();
        let condition = `?taskno=` + taskno + `&routeid=error_end`
        call(TaskConstants.apis['unNormalTaskChange'] + condition, null, "post").then(res => {
          this.cancle();
          if (res.resultCode == constant.SUCCESS) {
            this.$message({
              message: res.resultMsg,
              type: "success"
            });
            this.getList();
          } else {
            this.$message({
              message: res.resultMsg,
              type: "error"
            });
          }
        }).catch(err => {
          this.cancle();
        })
      },
      // 查询列表
      getList() {
        this.paginations.total = 0;
        this.tableData = [];
        this.searchParams.pageNumber = this.paginations.pageIndex;
        this.searchParams.pageSize = this.paginations.pageSize;
        this.show();
        call(TaskConstants.apis['unNormalTaskQuery'], this.searchParams, "post").then(res => {
          this.cancle();
          if (res.resultCode == constant.SUCCESS && res.data && res.data.list.length) {
            this.paginations.total = res.data.total;
            this.tableData = res.data.list;

          } else {
            this.$message.error("无符合条件任务！");
          }

        }).catch(err => {
          this.cancle();
        })
      },
      // 每页多少条切换
      handleSizeChange(pageSize) {
        this.paginations.pageSize = pageSize;
        this.getList();
      },
      // 上下分页
      handleCurrentChange(page) {
        this.paginations.pageIndex = page;
        this.getList();
      },
      // 根据条件查询列表
      search() {
        this.paginations.pageIndex = 1;
        if (this.searchParams.chdrnum != "") {
          if (isNotNumber(this.searchParams.chdrnum) || this.searchParams.chdrnum.length != 8) {
            this.$message.error("请正确输入保单号！");
            return;
          }
        }
        if (this.searchParams.caseno != "" && isNotNumber(this.searchParams.caseno)) {
          this.$message.error("请正确输入受理号！");
          return;
        }
        if (this.searchParams.depotno != "" && isCntainChinese(this.searchParams.depotno)) {
          this.$message.error("请正确输入存仓号！");
          return;
        }
        if (this.searchParams.dealbeginDate && this.searchParams.dealendDate) {
          let oDate1 = new Date(this.searchParams.dealbeginDate);
          let oDate2 = new Date(this.searchParams.dealendDate);
          if (oDate1.getTime() > oDate2.getTime()) {
            this.$message.error("起始时间不能大于结束时间！");
            return;
          }
        }
        this.getList();
      },
      // 清除查询条件
      resetSearch() {
        this.searchParams = JSON.parse(JSON.stringify(this.emptySearchParams));
      }
    }
  }
</script>

<style lang="less" scoped>
  .fillcontain {
    padding-bottom: 0;

    .fastQuery {
      padding: 15px 20px 10px 20px;
      background: #fff;
      border-bottom: 1px solid #e1e1e1;

      .fastQuery_title {
        color: #666;
        padding: 6px 0px;
      }

      .fastQuery_item {
        margin: 0 10px;
      }

      .item_default {
        .el-button {
          color: #409EFF !important;
          border-color: #c6e2ff !important;
          background-color: #ecf5ff !important;
        }

      }

      .moreCondition {
        color: #68a3fc;
        cursor: pointer;
        padding: 6px 0px;

        .el-icon-d-arrow-right {
          transform: rotate(90deg);
        }

        .el-icon-d-arrow-left {
          transform: rotate(-90deg);
        }
      }
    }
  }

  .contain {
    background: #fff;
    padding: 10px;
    margin-bottom: 20px;
  }

  .pagination {
    padding: 10px 20px;
    text-align: right;
  }

  .operationIcon {
    // padding: 12px;
    border: 1px solid #e5e5e5;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    display: inline-block;
    cursor: pointer;
    box-shadow: 0 0 3px #f9f9f9;
  }

  .search_container {
    padding: 20px 20px 0 20px;
    //    border-top: 1px solid #e1e1e1;
  }

  .common-box {
    padding-bottom: 10px;
  }

  .common-lab {
    line-height: normal !important;
    text-align: right;

    .labelName {
      text-align: right;
    }
  }
</style>



